$(function () {

    laydate.render({
        elem:'#month1'
        ,trigger:'click'
        ,type:'month'
        ,btns: ['confirm']
        ,value:new Date()
        ,done: function(value, date, endDate){//控件选择完毕后的回调---点击日期、清空、现在、确定均会触发。
            $('#month1').val(value);
            // $('#month1').val();


            var x=$('#month1').val();
            ajax1(x);

        }
    })


    laydate.render({
        elem:'#selectyear2'
        ,trigger:'click'
        ,type:'year'
        ,btns: ['confirm']
        ,value:new Date()
        ,done: function(value, date, endDate){//控件选择完毕后的回调---点击日期、清空、现在、确定均会触发。
            $('#selectyear2').val(value);
            var y=$('#selectyear2').val();
            //alert("点击时 y= "+y);

            // ajax1(y);
            ajax2(y);
        }
    })





    //柱状图
    // var ajax = new $ax(Feng.ctxPath + "/statistics/show", function (data) {
    //     // //柱状图
    //     // var users=[];
    //     // var balances=[];
    //     // for(var d in data){
    //     //     users.push(data[d]['accountname']);
    //     //     balances.push(data[d]['accountbalance']);
    //     // }
    //     //
    //     // // 基于准备好的dom，初始化echarts实例
    //     // var myChart = echarts.init(document.getElementById('main'));
    //     //
    //     // // 指定图表的配置项和数据
    //     // var option = {
    //     //     //标题
    //     //     title: {
    //     //         text: 'ECharts 入门示例'
    //     //     },
    //     //
    //     //     //鼠标在图形上的提示信息
    //     //     tooltip: {},
    //     //
    //     //     //图例
    //     //     legend: {
    //     //         data: [{
    //     //             name: '账户余额',  //需要和series的name关联
    //     //             // 强制设置图形为方形。
    //     //             icon: 'rect',
    //     //             // 设置文本为绿色
    //     //             textStyle: {
    //     //                 color: 'red'
    //     //             }
    //     //         }]
    //     //
    //     //     },
    //     //
    //     //     //x轴
    //     //     xAxis: {
    //     //         //指定x轴
    //     //         name:"账户",
    //     //         type: 'category',
    //     //
    //     //         data:users
    //     //
    //     //         // data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
    //     //
    //     //     },
    //     //
    //     //     //y轴
    //     //     yAxis: {
    //     //         name:"账户余额",
    //     //         type: 'value',
    //     //         min:0, //最小值
    //     //         title:{text:'账户余额'}
    //     //     },
    //     //
    //     //     //系列列表
    //     //     series: [{
    //     //         name: '账户余额', //系列名称
    //     //         type: 'bar', //系列图表类型
    //     //         data: balances //系列中的数据内容
    //     //     }]
    //     // };
    //     //
    //     // // 使用刚指定的配置项和数据显示图表。
    //     // myChart.setOption(option);
    //
    //
    //     //饼状图
    //     var mychart1=echarts.init(document.getElementById('personbing'));
    //     var option = {
    //         series : [
    //             {
    //                 name: '消费占比',
    //                 type: 'pie',
    //                 radius: '55%',
    //                 data:[
    //                     {value:235, name:'视频广告'},
    //                     {value:274, name:'联盟广告'},
    //                     {value:310, name:'邮件营销'},
    //                     {value:335, name:'直接访问'},
    //                     {value:400, name:'搜索引擎'}
    //                 ],
    //                 itemStyle: {
    //                     normal: {
    //                         shadowBlur: 200,
    //                         shadowColor: 'rgba(0, 0, 0, 0.5)'
    //                     }
    //                 }
    //             }
    //         ]
    //     };
    //     mychart1.setOption(option);
    //
    // }, function (data) {
    //     alert("错误")
    // });

    //guns的ajax
    // var ajax1 = new $ax(Feng.ctxPath + "/statistics/show1", function (data) {
    //
    //     //饼状图
    //     var paykind=[];
    //     for(var d in data){
    //         paykind.push({value: data[d], name: d});
    //     }
    //
    //     var mychart1=echarts.init(document.getElementById('personbing'));
    //     var option = {
    //         title: {
    //             text: '消费占比',
    //             left: 'center'
    //         },
    //         tooltip: {
    //             trigger: 'item'
    //         },
    //         legend: {
    //             orient: 'vertical',
    //             left: 'left',
    //         },
    //         toolbox: {
    //             feature: {
    //                 saveAsImage: {}
    //             }
    //         },
    //         series : [
    //             {
    //                 name: '消费占比',
    //                 type: 'pie',
    //                 radius: '55%',
    //                 data:paykind,
    //                 // itemStyle: {
    //                 //     normal: {
    //                 //         shadowBlur: 200,
    //                 //         shadowColor: 'rgba(0, 0, 0, 0.5)'
    //                 //     }
    //                 // }
    //                 emphasis: {
    //                     itemStyle: {
    //                         shadowBlur: 10,
    //                         shadowOffsetX: 0,
    //                         shadowColor: 'rgba(0, 0, 0, 0.5)'
    //                     }
    //                 }
    //             }
    //         ]
    //     };
    //     mychart1.setOption(option);
    //
    // }, function (data) {
    //     alert("cuowu")
    // });
    // var ajax2 = new $ax(Feng.ctxPath + "/statistics/show2?y="+y, function (data) {
    //
    //     var zhichu=[];
    //     var shouru=[];
    //
    //     alert("ajax2中的y= "+y);
    //     for(var d in data){
    //         // alert(data[d]['n1']+" "+data[d]['n2']+" "+data[d]['n3']);
    //         zhichu.push(data[d]['n2']);
    //         shouru.push(data[d]['n3']);
    //     }
    //
    //     var mychart2=echarts.init(document.getElementById('personxian'));
    //     var option = {
    //         title: {
    //             text: '收支曲线'
    //         },
    //         tooltip: {
    //             trigger: 'axis'
    //         },
    //         legend: {
    //             data: ['收入', '支出']
    //         },
    //         grid: {
    //             left: '3%',
    //             right: '4%',
    //             bottom: '3%',
    //             containLabel: true
    //         },
    //         toolbox: {
    //             feature: {
    //                 saveAsImage: {}
    //             }
    //         },
    //         xAxis: {
    //             type: 'category',
    //             boundaryGap: false,
    //             data: ['一月', '二月', '三月', '四月', '五月', '六月',
    //                 '七月','八月','九月','十月','十一月','十二月']
    //         },
    //         yAxis: {
    //             type: 'value'
    //         },
    //         series: [
    //             {
    //                 name: '支出',
    //                 type: 'line',
    //                 stack: '总量',
    //                 data: zhichu
    //             },
    //             {
    //                 name: '收入',
    //                 type: 'line',
    //                 stack: '总量',
    //                 data: shouru
    //             },
    //
    //
    //         ]
    //     };
    //     mychart2.setOption(option);
    //
    //
    // }, function (data) {
    //     alert("错误")
    // });

    //饼状图 消费占比
    var x=$('#month1').val();
    function ajax1(x) {
        $.ajax({
            type: "get", // 以get方式发起请求
            url: Feng.ctxPath + "/statistics/show1?x=" + x, // 将你的请求参数以问号拼接到url中进行参数传递
            success(data) {
                // data为返回值
                // 成功后的回调方法

                //饼状图
                var paykind=[];
                for(var d in data){
                    paykind.push({value: data[d], name: d});
                }

                var mychart1=echarts.init(document.getElementById('personbing'));
                var option = {
                    title: {
                        text: '消费占比',
                        left: 'center'
                    },
                    tooltip: {
                        trigger: 'item'
                    },
                    legend: {
                        orient: 'vertical',
                        left: 'left',
                    },
                    toolbox: {
                        feature: {
                            saveAsImage: {}
                        }
                    },
                    series : [
                        {
                            name: '消费占比',
                            type: 'pie',
                            radius: '55%',
                            data:paykind,
                            emphasis: {
                                itemStyle: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                                }
                            }
                        }
                    ]
                };
                mychart1.setOption(option);
            },
            error(data){
                alert("cuowu");
            }

        })
    }

    //折线图 收支曲线
    var y=$('#selectyear2').val();
    function ajax2(y) {
        $.ajax({
            type: "get", // 以get方式发起请求
            url: Feng.ctxPath + "/statistics/show2?y=" + y, // 将你的请求参数以问号拼接到url中进行参数传递
            success(data) {

                    var zhichu=[];
                    var shouru=[];

                    for(var d in data){
                        // alert(data[d]['n1']+" "+data[d]['n2']+" "+data[d]['n3']);
                        zhichu.push(data[d]['big2']);
                        shouru.push(data[d]['big3']);
                    }

                    var mychart2=echarts.init(document.getElementById('personxian'));
                    var option = {
                        title: {
                            text: '收支曲线'
                        },
                        tooltip: {
                            trigger: 'axis'
                        },
                        legend: {
                            data: ['收入', '支出']
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        toolbox: {
                            feature: {
                                saveAsImage: {}
                            }
                        },
                        xAxis: {
                            type: 'category',
                            boundaryGap: false,
                            data: ['一月', '二月', '三月', '四月', '五月', '六月',
                                '七月','八月','九月','十月','十一月','十二月']
                        },
                        yAxis: {
                            type: 'value'
                        },
                        series: [
                            {
                                name: '支出',
                                type: 'line',

                                data: zhichu
                            },
                            {
                                name: '收入',
                                type: 'line',

                                data: shouru
                            },


                        ]
                    };
                    mychart2.setOption(option);
            },
            error(data){
                alert("错误");
            }

        })
    }

    ajax1(x);
    ajax2(y);

    // ajax1.start();
    // ajax2.start();




    // var year=$('#selectyear').val();
    // alert(year);


});